<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>localstorage</title>
</head>
<body>
<h2>localstorage</h2>
<button onclick="savedate()">点我保存一个数据</button>
<button onclick="readdate()">点我读取一个数据</button>
<button onclick="deletedate()">点我删除一个数据</button>
<button onclick="cleardate()">点我清楚所有数据</button>
<script type="text/javascript">
    let  p={name:'张三',age:'29'}
    //保存本地缓存
    function savedate(){
        localStorage.setItem('msg','hello')
        localStorage.setItem('msg2',666)
        localStorage.setItem('msg3',JSON.stringify(p))
    }
    //读取某个本地缓存
    function readdate(){
        console.log( localStorage.getItem('msg'))
        console.log( localStorage.getItem('msg2'))
        const result=localStorage.getItem("msg3")
        console.log( JSON.parse(result))
    }
    //删除某个本地缓存
    function deletedate(){
        localStorage.removeItem('msg')
    }
    //清楚所有本地缓存数据
    function cleardate(){
        localStorage.clear()
    }

</script>
</body>
</html>